<!DOCTYPE html>
<html>

<head>
    <meta charset="UTF-8">
    <!-- import CSS -->
    <link rel="stylesheet" href="../../element/index.css">
</head>

<body>
    <button @click="getBookList()">刷新</button>
    <div id="app">
        <el-table :data="tableData" border style="width: 100%">
            <el-table-column fixed prop="create_time" label="上传日期" width="150">
            </el-table-column>
            <el-table-column prop="name" label="书名" width="120">
            </el-table-column>
            <el-table-column prop="pic" label="图片" width="120">
                <template slot-scope="scope">
                    <img :src="scope.row.pic" style="max-height: 120px" alt="这是图书封面">
                </template>
            </el-table-column>
            <el-table-column prop="length" label="字数" width="120">
            </el-table-column>
            <el-table-column prop="summary" label="简介" width="300">
            </el-table-column>
            <el-table-column prop="zjnums" label="章节数" width="120">
            </el-table-column>
            <el-table-column prop="views" label="观看数" width="120">
            </el-table-column>
            <el-table-column label="操作" width="100">
                <template slot-scope="scope">
                    <el-button @click="handleClick(scope.row)" type="text" size="small">查看</el-button>
                    <el-button type="text" size="small">编辑</el-button>
                </template>
            </el-table-column>
        </el-table>
    </div>
</body>
<!-- import Vue before Element -->
<script src="../../element/vue.js"></script>
<script src="../../element/axios.js"></script>
<!-- <script src="https://unpkg.com/axios/dist/axios.min.js"></script> -->
<!-- import JavaScript -->
<script src="../../element/index.js"></script>
<script src="../../component/layui/layui.js?v=1"></script>
<script src="../../component/pear/pear.js"></script>
<script>
    new Vue({
        el: '#app',
        data: function () {
            return {
                tableData: []
            }
        },
        beforeMount() {
            this.getBookList()
        },
        methods: {
            handleClick(row) {
                console.log(row);
            },
            getBookList() {
                let that = this
                layui.use(['admin', 'context', 'popup'], function() {
                    console.log('2222')
                    layui.admin.setConfigPath('../../config/pear.config.json')
                    var config = layui.admin.readConfig();
                    console.log(config)
                    axios.post('http://'+window.location.host+'/admin/booklist', {
                        'page':1,
                        'limit':30,
                        'token': layui.context.get('token'),
                        'userid': layui.context.get('userid'),
                    }).then(function (response) {
                        if (!response.data.status) {
                            that.tableData = response.data.data.list
                        }
                        console.log(response.data.msg);
                    })
                    .catch(function (error) {
                        console.log(error);
                    });
                })

            }
        },
    })
</script>

</html>